// 特殊扣分申请

<template>
    <div class="box">
      <div style="margin-top: 20px; font-size: 14px">
        年份:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <el-select v-model="yearNumber" @change="apply">
          <el-option v-for="year in yearOptions" :key="year.value" :label="year.label" :value="year.value"></el-option>
        </el-select>
      </div>
  
      <div style="margin-left: 400px; margin-top: -35px; font-size: 14px">
        状态:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <el-select v-model="selectedStatus" @change="apply">
          <el-option v-for="status in statusOptions" :key="status.value" :label="status.label"
            :value="status.value"></el-option>
        </el-select>
      </div>
  
      <br /><br />
      <el-button size="mini" type="success" plain icon="el-icon-plus"  style="margin-left: 20px" @click="handleAdd">新增</el-button>
      <el-button size="mini" type="info" plain icon="el-icon-edit" style="margin-left: 20px" @click="handleEdit">编辑</el-button>
      <el-button size="mini" type="danger"  plain icon="el-icon-delete" style="margin-left: 20px" @click="handleDelete">删除</el-button>
      <el-button size="mini" type="warning" plain icon="el-icon-download" style="margin-left: 20px; margin-bottom: 20px;" @click="derive">导出</el-button>
  
      <el-table :data="tableData" style="width: 96%" border @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column prop="accessorys" align="center"  label="考核对象" width="180"></el-table-column>
        <el-table-column prop="cause_deduction" align="center" label="扣分原因" width="380"></el-table-column>
        <el-table-column prop="score_applyforss" align="center"  label="申请分值"></el-table-column>
        <el-table-column prop="auditopinionyhc" align="center"  label="审核意见"></el-table-column>
        <el-table-column prop="score_audit" align="center"  label="审核分值"></el-table-column>
        <el-table-column prop="state" align="center"  label="状态"></el-table-column>
      </el-table>
      <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
      <el-form :model="tableData" :rules="rules" label-width="130px">
        <el-form-item label="请选择考核对象" prop="accessorys">
          <el-select v-model="tableData.accessorys" placeholder="请选择考核对象" :disabled="title === '修改'">
            <el-option v-for="option in oneIndexOptions" :key="option" :value="option.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="扣分原因" prop="cause_deduction">
          <el-input v-model="tableData.cause_deduction" placeholder="请输入扣分原因" />
        </el-form-item>
        <el-form-item label="申请分值" prop="score_applyforss">
          <el-input v-model="tableData.score_applyforss" placeholder="请输入扣分分值" :disabled="title === '修改'" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    </div>
  </template>

<script>
import { apply } from "../../../api/zhenfu/JiaFenShenQingss";

export default {
  data() {
    return {
      yearNumber: new Date().getFullYear(), // 初始化为当前年份
      selectedStatus: "", // 状态选项
      tableData: [], // 用于表格的数据
      yearOptions: [], // 年份选项
      statusOptions: [ // 状态选项
        { value: 'pending', label: '待审核' },
        { value: 'approved', label: '已审核' },
        { value: 'rejected', label: '已拒绝' },
      ],
      oneIndexOptions: [], // 用于存储考核对象选项
      selectedRows: [], // 选中的表格行
      open: false,
      title: '',
      num: 0,
    };
  },
  created() {
    this.fetchYearOptions();
    this.apply();
    this.fetchOneIndexOptions(); // 获取考核对象选项

  },
  methods: {
    // 获取年份选项
    fetchYearOptions() {
      const currentYear = new Date().getFullYear();
      for (let i = currentYear; i >= currentYear - 10; i--) {
        this.yearOptions.push({ value: i, label: `${i}年` });
      }
    },
    // 获取表格数据
    apply() {
      apply({ year: this.yearNumber, status: this.selectedStatus })
        .then((res) => {
          // 确保正确解析 API 返回的数据
          if (res.success && res.code === 200) {
            this.tableData = res.result || [];
               // 提取考核对象选项
          this.oneIndexOptions = this.tableData.map(item => ({
            value: item.accessorys
          }));
          } else {
            this.$message.error(res.message || "获取数据失败");
          }
        })
        .catch((err) => {
          console.error("获取数据失败:", err);
          this.$message.error("获取数据失败");
        });
    },
    // 选中行变化
    handleSelectionChange(val) {
      this.selectedRows = val;
    },
    handleAdd() {
      console.log('handleAdd called');
      this.open = true;
      this.title = "新增";
      this.num = 1;
      this.tableData = {
        accessorys: "",
        cause_deduction: "",
        score_applyforss: "",
      };
      // 新增逻辑
    },
    handleEdit() {
      // 编辑逻辑
      console.log('handleAdd called');
      this.open = true;
      this.title = "编辑";
      this.num = 1;
      this.tableData = {
        accessorys: "",
        cause_deduction: "",
        score_applyforss: "",
      };
    },
    handleDelete() {
      // 删除逻辑
    },
    derive() {
      // 导出逻辑
    }
  }
};
</script>
  <style scoped>
    .box{
        margin-left: 30px;
        margin-top: 20px;
    }

</style>